<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>axios常用配置以及默认配置</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.27.2/axios.min.js"></script>

</head>

<body>
  <button>战士</button>
  <button>法师</button>
  <!-- 
    接口: http://api.xiaohigh.com/lol  
    -->

  <script>
    let btns = document.querySelectorAll('button')
    //全局配置
    axios.defaults.baseURL = 'http://api.xiaohigh.com'  //基础路径
    axios.defaults.timeout = 1000 *2  //超时时间

    btns[0].onclick = async function () {
      //发送axios
        let response = await axios({
          url: '/lol ',
          method: 'GET',
          params:{
            q: '战士'
          },
           //局部配置
          // headers:{name:'liyaguang'}, //设置请求头
          // timeout:1000*2 , //设置超时时间
          // baseURL:'http://api.xiaohigh.com' //设置基础路径
        })
        console.log(response)
        console.log(response.data)
    }

    btns[1].onclick = async function () {
      //发送axios
      try {
        let response = await axios({
          url: '/lol ',
          method: 'GET',
          params: {
            q: '法师'
          },
          //局部配置
          // headers:{name:'bbb'} //设置请求头
          // timeout:1000*2 , //设置超时时间
          // baseURL:'http://api.xiaohigh.com' //设置基础路径
        })
        console.log(response)
        console.log(response.data)
      } catch (error) {
        console.log(error)
        console.log(error.message)
      }
    }
  </script>
</body>

</html>